<template>
 <nav class="navbar col-lg-12 col-12 p-0 d-flex flex-row justify-content-start">
      <div class="navbar-brand align-items-center d-flex flex-row justify-content-center col-2" style="height: 60px;">
        <span>师生交流预约系统</span>
        <button></button>
      </div>
      <div class="d-flex col justify-end align-items-center" id="navbarSupportedContent">
        <div class="d-flex w-75 justify-content-center">
          <input class="form-control mr-2 w-75" type="search" placeholder="Search" aria-label="Search">
          <button class="btn btn-outline-success" type="submit">Search</button>
        </div>
      </div>
      <span class="d-flex font-weight-normal mr-5">管理员</span>
      <RouterLink :to="{path:'/'}" class="d-flex btn btn-outline-primary mr-5"  type="button">退出登录</RouterLink>
  </nav>

  <div class="row w-100">
  <el-radio-group v-model="isCollapse" style="margin-bottom: 20px">
    <el-radio-button :value="false">展开</el-radio-button>
    <el-radio-button :value="true">隐藏</el-radio-button>
  </el-radio-group>
  <el-menu
    router
    default-active="1-1"
    class="el-menu-vertical-demo col-1"
    :collapse="isCollapse"
  >
    <el-sub-menu index="/adminIndex/">
      <template #title>
        <el-icon><EditPen /></el-icon>
        <span>信息管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="/adminIndex/studentsList">学生信息</el-menu-item>
        <el-menu-item  index="/adminIndex/teachersList">教师信息</el-menu-item>
      </el-menu-item-group>
    </el-sub-menu>
    <el-menu-item index="/adminIndex/notice">
      <el-icon><Notebook /></el-icon>
      <template #title>公告</template>
    </el-menu-item>
  </el-menu>
  <div class="col-9"><RouterView></RouterView></div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import {
  Notebook,
  EditPen,
  Setting,
} from '@element-plus/icons-vue'
import router from '@/router';

const isCollapse = ref(true)
</script>

<style>
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}
</style>